<template>
  <div class="inner">
    <el-form
      :model="baseInfo"
      style="margin-top: 18px"
      :rules="personInfoRules"
      label-width="120px"
    >
      <el-row class="line-text-title" type="flex" align="middle">
        <span class="title-medium text-important">基本信息</span>
      </el-row>
      <el-row>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="会诊医院"
            prop="serviceCenterId"
            :rules="[
              {
                required: true,
                message: '请选择会诊医院',
                trigger: 'blur'
              }
            ]"
          >
            <!-- <el-select
                            size="mini"
                            id="add-application-select-organization"
                            v-model="personExpandInfo.serviceCenterId"
                            class="width-input-normal"
                            placeholder="请选择"
                            disabled
                        >
                            <el-option
                                v-for="item in contractHospitalList"
                                :key="item.serviceInstitutionId"
                                :label="item.name"
                                :value="item.serviceInstitutionId"
                            >
                            </el-option>
                        </el-select> -->
            <el-input
              size="mini"
              v-model="personExpandInfo.serviceCenterName"
              placeholder="会诊医院"
              class="width-input-normal"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="会诊类型"
            prop="typeOfConsultation"
            :rules="[
              {
                required: true,
                message: '请选择会诊类型',
                trigger: 'blur'
              }
            ]"
          >
            <el-select
              size="mini"
              v-model="personExpandInfo.typeOfConsultation"
              class="width-input-normal"
              placeholder="请选择"
            >
              <el-option
                v-for="consultation in Consultations"
                :key="consultation.dicCode"
                :label="consultation.dicName"
                :value="consultation.dicCode"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!--术中冰冻-->
        <el-col
          :xs="24"
          :sm="8"
          :md="6"
          :lg="6"
          :xl="6"
          v-if="personExpandInfo.typeOfConsultation === 1357"
        >
          <el-form-item label="预约时间" prop="frozenAppointmentTime">
            <el-date-picker
              size="mini"
              v-model="personExpandInfo.frozenAppointmentTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              placeholder="选择日期"
              class="width-input-normal"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col
          :xs="24"
          :sm="8"
          :md="6"
          :lg="6"
          :xl="6"
          v-if="personExpandInfo.typeOfConsultation === 1357"
        >
          <el-form-item label="上午下午" prop="morningAndAfternoon">
            <el-select
              size="mini"
              v-model="personExpandInfo.morningAndAfternoon"
              class="width-picker-normal"
              placeholder="请选择"
            >
              <el-option
                v-for="it in morningAndAfternoonList"
                :key="it.id"
                :label="it.value"
                :value="it.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="送检医院"
            prop="sendingHospitalName"
            :rules="[
              {
                required: true,
                message: '请输入病人送检医院',
                trigger: 'blur'
              }
            ]"
          >
            <el-input
              size="mini"
              v-model="personExpandInfo.sendingHospitalName"
              placeholder="请输入送检医院"
              class="width-input-normal"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="送检医生" prop="sendingDoctor">
            <el-input
              size="mini"
              v-model="personExpandInfo.sendingDoctor"
              placeholder="请输入送检医生"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="送检医生手机" prop="sendingDoctorPhone">
            <el-input
              size="mini"
              v-model="personExpandInfo.sendingDoctorPhone"
              placeholder="请输入送检医生手机"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row class="line-text-title" type="flex" align="middle">
        <span class="title-medium text-important">病理信息</span>
      </el-row>
      <el-row>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="病理号"
            prop="pathologyId"
            :rules="[
              {
                required: true,
                message: '请输入病理号',
                trigger: 'blur'
              }
            ]"
          >
            <el-input
              size="mini"
              v-model="personExpandInfo.pathologyId"
              placeholder="请输入病理号"
              class="width-input-normal"
              disabled
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="姓名" prop="name">
            <el-input
              size="mini"
              v-model="baseInfo.name"
              placeholder="请输入姓名"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="性别" prop="sex">
            <el-select
              v-model="baseInfo.sex"
              placeholder="性别"
              clearable
              size="mini"
              class="width-input-normal"
            >
              <el-option
                v-for="(item, $index) in sexData"
                :key="$index"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="年龄" prop="age">
            <el-input
              size="mini"
              v-model.number="baseInfo.age"
              placeholder="年龄"
              class="width-input-normal"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="手机号码" prop="cellphone">
            <el-input
              placeholder="手机号码"
              v-model.number="baseInfo.cellphone"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="身份证号" prop="identicalNumber">
            <el-input
              placeholder="身份证号"
              v-model="baseInfo.identicalNumber"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="联系人姓名" prop="contactName">
            <el-input
              size="mini"
              v-model="baseInfo.contactName"
              placeholder="请输入联系人姓名"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="联系人微信" prop="contactWeChat">
            <el-input
              placeholder="请输入联系人微信号"
              v-model.number="baseInfo.contactWeChat"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="住院号" prop="hospitalNumber">
            <el-input
              placeholder="请输入住院号"
              v-model="personExpandInfo.hospitalNumber"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="床号" prop="bedNo">
            <el-input
              placeholder="请输入床号"
              v-model="personExpandInfo.bedNo"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="取材脏器"
            prop="viscera"
            :rules="[
              {
                required: true,
                message: '请选择取材脏器',
                trigger: 'blur'
              }
            ]"
          >
            <el-select
              v-model="personExpandInfo.viscera"
              placeholder="请选择取材脏器"
              clearable
              size="mini"
              class="width-input-normal"
            >
              <el-option
                v-for="item in organsList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item
            label="标本类别"
            prop="specimenCategory"
            :rules="[
              {
                required: true,
                message: '请选择标本类别',
                trigger: 'blur'
              }
            ]"
          >
            <el-select
              v-model="personExpandInfo.specimenCategory"
              placeholder="请选择标本类别"
              clearable
              size="mini"
              class="width-input-normal"
            >
              <el-option
                v-for="item in dictsList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="病区" prop="ward">
            <el-input
              placeholder="请输入病区"
              v-model="personExpandInfo.ward"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
        <el-col :xs="24" :sm="8" :md="6" :lg="6" :xl="6">
          <el-form-item label="曾就诊医院" prop="usedHospitals">
            <el-input
              placeholder="请输入曾就诊医院名称"
              v-model="baseInfo.usedHospitals"
              size="mini"
              class="width-input-normal"
            ></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- <el-row>
                <div style="margin-top: 6px; text-align: center">
                    <el-button
                        type="primary"
                        size="mini"
                        @click="submitBaseInfo"
                    >提交</el-button>
                </div>
            </el-row> -->
    </el-form>
  </div>
</template>

<script>
import ConsultationDefault from '@/templates/ConsultationDefault'

export default {
  name: 'ConsultationInfoView',
  props: {
    orders: {
      type: Object,
      default: ConsultationDefault
    }
  },
  data() {
    const checkPhone = (rule, value, callback) => {
      const reg = /^1[3|4|5|7|8][0-9]\d{8}$/
      if (!value) {
        return callback(new Error('请输入手机号'))
      }
      if (!reg.test(value)) {
        return callback(new Error('手机号不正确'))
      }
      return callback()
    }
    const checkIdCard = (rule, value, callback) => {
      if (!value) {
        return callback(new Error('身份证号不能为空'))
      }
      //   const reg =
      //     /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
      //   if (reg.test(value)) {
      //     return callback()
      //   }
      //   return callback(new Error('身份证格式不正确'))
    }
    return {
      baseInfo: {},
      //病人拓展信息
      personExpandInfo: {
        bedNo: '', //床号
        frozenAppointmentTime: '', //冰冻时间
        hospitalNumber: '', //住院号
        morningAndAfternoon: '', //上下午
        pathologyId: '', //病理号
        sendingDoctor: '', //送检医生
        sendingHospitalId: this.$store.state.institution.id, //送检医院id
        sendingHospitalName: this.$store.state.institution.name, //送检医院名称
        sendingDoctorPhone: '', //送检医生手机号
        serviceCenterId: '', //会诊医院id
        serviceCenterName: '', //会诊医院名称
        specimenCategory: '', //标本类别
        typeOfConsultation: '', //会诊类型
        viscera: '', //取材脏器
        ward: '', //病区
        diagnosisContent: '', //临床诊断
        diagnosisHistory: '', //病史摘要
        orginalPhythologyDiagnosis: '', //病理诊断
        resultPhythologyDiagnosis: '', //已做免疫组化或者分子病理结果临床诊断
        pathologyObserved: '' //病理信息-大体观察巨检
      },
      expendData: {
        bedNo: '', //床号
        hospitalNumber: '', //住院号
        pathologyId: '', //病理号
        specimenCategory: '', //标本类别
        viscera: '', //取材脏器
        ward: '' //病区
      },
      personInfoRules: {
        contactCellphone: [{ required: true, validator: checkPhone, trigger: 'blur' }],
        cellphone: [{ required: true, validator: checkPhone, trigger: 'blur' }],
        identicalNumber: [{ required: false, trigger: 'blur', validator: checkIdCard }]
      },
      sexData: [],
      // 上下午
      morningAndAfternoonList: [
        { id: 0, value: '上午' },
        { id: 1, value: '下午' }
      ],
      contractHospitalList: [], // 申请机构列表
      Consultations: [], // 会诊类型
      dictsList: [], //标本类别
      organsList: [] //取材脏器
    }
  },
  mounted() {
    this.getConsultations()
    //this.getContractHospitalList()
    this.getDictsList()
    //this.getOrgansList()
    this.getSexList()
    if (this.orders.patients.length > 0) {
      this.personExpandInfo = this.orders
      this.baseInfo = this.orders.patients[0]
    } else {
      this.$message.info('无病人信息')
    }
    const diagnosisHistory = this.orders.patients[0].diagnosisHistory[0]
    Object.keys(this.expendData).forEach(key => {
      this.$set(this.personExpandInfo, key, diagnosisHistory[key])
    })
  },
  methods: {
    //获取性别
    getSexList() {
      this.$axios({
        method: 'get',
        url: '/dicts/list',
        params: {
          code: 'SexKind'
        }
      }).then(res => {
        if (res && res.data.code === 200) {
          res.data.data.forEach(element => {
            this.sexData.push({
              name: element.name,
              id: element.id
            })
          })
        }
      })
    },
    //修改基本信息
    submitBaseInfo() {
      let Data = {
        age: this.baseInfo.age, //病人年龄
        cellphone: this.baseInfo.cellphone, //病人电话
        contactCellphone: this.baseInfo.contactCellphone, //联系人电话
        contactName: this.baseInfo.contactName, //联系人姓名
        contactWeChat: this.baseInfo.contactWeChat, //联系人微信号
        identicalNumber: this.baseInfo.identicalNumber, //病人身份证号
        name: this.baseInfo.name, //病人姓名
        relationWithPatient: this.baseInfo.relationWithPatient, //联系人与病人的关系
        sex: this.baseInfo.sex, //病人性别(0：女，1：男，2：未知)
        usedHospitals: this.baseInfo.usedHospitals, //曾就诊过的医院

        id: this.personExpandInfo.id, //订单id
        bedNo: this.personExpandInfo.bedNo, //床号
        frozenAppointmentTime: this.personExpandInfo.frozenAppointmentTime, //冰冻预约时间
        hospitalNumber: this.personExpandInfo.hospitalNumber, //住院号
        morningAndAfternoon: this.personExpandInfo.morningAndAfternoon, //上午还是下午
        pathologyId: this.personExpandInfo.pathologyId, //病理号
        relationWithPatient: this.personExpandInfo.relationWithPatient, //与患者关系
        sendingDoctor: this.personExpandInfo.sendingDoctor, //送检医生
        sendingDoctorPhone: this.personExpandInfo.sendingDoctorPhone, //送检手机号
        specimenCategory: this.personExpandInfo.specimenCategory, //标本类别
        typeOfConsultation: this.personExpandInfo.typeOfConsultation, //会诊类别
        usedHospitals: this.personExpandInfo.usedHospitals, //增就诊医院
        viscera: this.personExpandInfo.viscera, //取材脏器
        ward: this.personExpandInfo.ward //病区
      }
      this.$axios({
        method: 'POST',
        url: `/orders/modifyOrderInformation`,
        data: Data
      }).then(res => {
        if (res && res.data.code === 200) {
          this.$message.success('提交成功')
        }
      })
    },
    // 获取标本类别
    getDictsList() {
      this.$axios({
        method: 'get',
        url: '/dicts/list',
        params: {
          code: 'specimenCategory'
        }
      }).then(res => {
        if (res && res.data.code === 200) {
          res.data.data.forEach(element => {
            this.dictsList.push({
              name: element.name,
              id: element.id
            })
          })
        }
      })
    },
    // 获取取材脏器
    getOrgansList() {
      this.$axios({
        method: 'get',
        url: '/organs/allList'
      }).then(res => {
        if (res && res.data.code === 200) {
          res.data.data.forEach(element => {
            this.organsList.push({
              name: element.name,
              id: element.id
            })
          })
        }
      })
    },
    // 申请机构列表
    getContractHospitalList() {
      this.$axios({
        method: 'get',
        url: '/institutions/allSigns'
      }).then(res => {
        if (res && res.data.code === 200) {
          res.data.data.forEach(element => {
            this.contractHospitalList.push({
              name: element.serviceInstitutionName,
              serviceInstitutionId: element.serviceInstitutionId
            })
          })
        }
      })
    },

    // 字典数据 会诊类型
    getConsultations() {
      this.$axios({
        method: 'get',
        url: '/dicts/list',
        params: {
          code: 'consultationType'
        }
      }).then(res => {
        if (res && res.data.code === 200) {
          res.data.data.forEach(element => {
            this.Consultations.push({
              dicName: element.name,
              dicCode: element.id
            })
          })
        }
      })
    }
  }
}
</script>

<style scoped>
.inner {
  border-bottom: #f4f4f4 1px;

  padding: 5px 15px 15px;

  background: #f4f4f4;

  margin-top: 20px;

  font-size: 14px;
}
.width-select-normal {
  width: 296px;
  height: 28px;
}
.width-input-normal {
  width: 100%;
  max-width: 210px;
}
</style>
